<template>
  <el-row>
    <el-col :span="24">
      <el-tabs v-model="activeName2" type="card">
         <el-tab-pane label="危险品作域" name="1">
          <el-row>
            <el-col :span="18">
              <el-card class="charts-card">
                <img src="../../assets/zl/wb/mj.png" alt="" style="width: 100%;height:700px">
              </el-card>
            </el-col>
            <el-col :span="6">
              <el-card class="charts-card">
                <h3>设备操作</h3>

                <el-form ref="form" :model="form" label-width="80px">

                  <el-form-item label="智能控制">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="1号门">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="2号门">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="3号门">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>

                  <el-form-item label="1排风口">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="2排风口">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="1排水口">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="2排水口">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>

                  <el-form-item label="1冷却水">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="2冷却水">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>
                  <el-form-item label="3冷却水">
                    <el-switch v-model="form.val" on-color="#13ce66" off-color="#ff4949"></el-switch>
                  </el-form-item>

                </el-form>
              </el-card>
            </el-col>
          </el-row>

          <el-row>
            <el-col :span="24">
              <el-card class="charts-card">
                <h3>CCTV联动监控</h3>
                <!-- <img src="../../assets/smaq/厂区周界视频监控.png" alt="" style="width: 100%;height:400px;"> -->
                <img src="../../assets/zl/bj/bj.png" alt="">
                <!-- <img src="../../assets/smaq/危化区域监控.png" alt="" style="width: 100%;height:400px;"> -->
              </el-card>
            </el-col>
            <!--  <el-col :span="12">
                <el-card class="charts-card">
                  <h3>关键区域监控</h3>
                  <img src="../../assets/smaq/关键区域监控.png" alt="" style="width: 100%;height:400px;">
                </el-card>
              </el-col> -->
            <!-- <el-col :span="12">
                <el-card class="charts-card">
                  <h3>重点人员监控</h3>
                  <img src="../../assets/smaq/重点人员监控.png" alt="" style="width: 100%;height:400px;">
                </el-card>
              </el-col>
              <el-col :span="12">
                <el-card class="charts-card">
                  <h3>物品遗留</h3>
                  <img src="../../assets/smaq/物品遗留.png" alt="" style="width: 100%;height:400px;">
                </el-card>
              </el-col> -->
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="智能安防" name="2">
          <el-row>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>厂区周界视频监控</h3>
                <img src="../../assets/smaq/厂区周界视频监控.png" alt="" style="width: 100%; height:400px;">
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>人脸识别</h3>
                <img src="../../assets/smaq/人脸识别.png" alt="" style="width: 100%;height:400px;">
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>门禁监测</h3>
                <img src="../../assets/smaq/门禁监测.png" alt="" style="width: 100%;height:400px;">
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>厂区道路测速监控</h3>
                <img src="../../assets/smaq/厂区道路测速监控.png" alt="" style="width: 100%;height:400px;">
              </el-card>
            </el-col>
          </el-row>
        </el-tab-pane>
       
        <el-tab-pane label="高危区域监控" name="3">
          <el-row>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>车辆监控</h3>
                <img src="../../assets/smaq/车辆监控.png" alt="" style="width: 100%;height:400px;">
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>穿越警戒线报警</h3>
                <img src="../../assets/smaq/穿越警戒线报警.png" alt="" style="width: 100%;height:400px;">
              </el-card>
            </el-col>
            <el-col :span="12">
              <el-card class="charts-card">
                <h3>车辆识别</h3>
                <img src="../../assets/smaq/车辆识别.png" alt="" style="width: 100%;height:400px;">
              </el-card>
            </el-col>
          </el-row>
        </el-tab-pane>
        <el-tab-pane label="智能巡逻安排" name="4">
          <el-row>
            <el-col :span="24">
              <el-card class="charts-card">
                <img src="../../assets/smaq/工作站巡查配置1.png" alt="" style="width: 100%;">
              </el-card>
            </el-col>
            <el-col :span="24">
              <el-card class="charts-card">
                <img src="../../assets/smaq/工作站巡查配置2.png" alt="" style="width: 100%;">
              </el-card>
            </el-col>
          </el-row>

          <!--  <el-card class="charts-card">
                                  <el-row style="margin-bottom: 10px;">
                                    <el-col :span="24">
                                      <el-input placeholder="条件搜索" icon="search" v-model="form.val" :on-icon-click="handleIconClick" style="width: 200px;">
                                      </el-input>
                                      <el-button type="primary">搜索</el-button>
                                      <el-button type="primary">添加班次</el-button>
                                      <el-button type="primary">导入</el-button>
                                      <el-button type="primary">导出</el-button>
                                    </el-col>
                                  </el-row>
                                  <el-row>
                                    <el-col :span="24">
                                      <el-table :data="tableData_4_1" style="width: 100%">
                                        <el-table-column prop="name" label="班次名称">
                                        </el-table-column>
                                        <el-table-column prop="y" label="路线">
                                        </el-table-column>
                                        <el-table-column prop="q" label="状态"></el-table-column>
                                        <el-table-column prop="g" label="巡逻结果"></el-table-column>
                                        <el-table-column prop="g" label="计划开始时间"></el-table-column>
                                        <el-table-column prop="g" label="计划巡逻视窗"></el-table-column>
                                        <el-table-column label="状态">
                                          <template scope="scope">
                                            <el-switch v-model="scope.row.status" on-color="#13ce66" off-color="#ff4949" on-value="100" off-value="0">
                                            </el-switch>
                                          </template>
                                        </el-table-column>
                                        <el-table-column label="推荐值" width="180">
                                          <template scope="scope">
                                            <el-rate v-model="scope.row.tj" disabled show-text text-color="#ff9900">
                                            </el-rate>
                                          </template>
                                        </el-table-column>
                                        <el-table-column label="操作">
                                          <template scope="scope">
                                            <el-button type="text" size="small">查看</el-button>
                                            <el-button type="text" size="small">编辑</el-button>
                                            <el-button type="text" size="small">删除</el-button>
                                          </template>
                                        </el-table-column>
                                      </el-table>
                                    </el-col>
                                    <el-col :span="24">
                                      <el-pagination :current-page="400" :page-sizes="[100, 200, 300, 400]" :page-size="100" layout="total, sizes, prev, pager, next, jumper" :total="400" style="float:right;margin-top: 10px;">
                                      </el-pagination>
                                    </el-col>
                                  </el-row>
                                </el-card> -->

        </el-tab-pane>
      </el-tabs>
    </el-col>
  </el-row>
</template>

<script>
export default {
  data() {
    return {
      form: {
        val: null,
      },
      activeName2: '1',
      tableData_4_1: [{
        name: 'xxx',
        y: '',
        q: '',
        g: '',
        status: '100',
        tj: 3.5,
      }]
    }
  },
  methods: {

  },
  mounted() {

  }
}
</script>

<style scoped>

</style>